<template>
    <div class="contain">
        <div class="title">修改密码</div>
        <div class="content">
            <a-form-model :label-col="labelCol" :wrapper-col="wrapperCol" :rules="rules">
                <a-form-model-item label="旧密码" prop="1">
                    <a-input-password v-model="formData.oldpwd"></a-input-password>
                </a-form-model-item>
                <a-form-model-item label="新密码" prop="2">
                    <a-input-password v-model="formData.newpwd"></a-input-password>
                </a-form-model-item>
                <a-form-model-item label="再次输入新密码" prop="3">
                    <a-input-password v-model="formData.newpwd2"></a-input-password>
                </a-form-model-item>
                <a-form-model-item style="text-align: center;margin-left: 38.5%">
                    <a-button type="primary" html-type="submit" @click="onSubmit">
                        保存
                    </a-button>
                </a-form-model-item>
            </a-form-model>
        </div>
    </div>
</template>

<script>
import aesUtil from '@/plugins/common/aesUtil';

export default {
    name: 'changePassword',
    data() {
        return {
            labelCol: {span: 8},
            wrapperCol: {span: 5},
            formData: {
                oldpwd: '',
                newpwd: '',
                newpwd2: ''
            },
            rules: {
                1: [{
                    required: true, message: '请输入旧密码'
                }],
                2: [{
                    required: true, message: '请输入新密码'
                }],
                3: [{
                    required: true, message: '请重复新密码'
                }]
            }
        }
    },
    methods: {
        onSubmit() {
            if (this.formData.newpwd != this.formData.newpwd2) {
                this.$util.alert('两次输入的密码不相同', 2);
                return;
            }
            this.$api.ajaxData({
                authorization: true,
                pathName: 'doUpdatePwd',
                params: {
                    password: encodeURIComponent(aesUtil.encrypt(
                        this.formData.newpwd
                    ))
                }
                // eslint-disable-next-line no-unused-vars
            }).then(res => {
                    this.$util.alert('修改成功', 2)
                }
            )

        }
    }
}
</script>

<style scoped lang="scss">
.contain {
    padding: 0 20px;
    border: 1px solid #f7f7f7;
    background: #fff;

    .title {
        height: 50px;
        margin: 0 20px;
        line-height: 50px;
        font-size: 14px;
        font-weight: bold;
        color: #333;
        border-bottom: 1px solid #f7f7f7;
    }

    .content {
        padding: 40px 0 20px 20px;
    }
}
</style>
